<template>
  <div>
    <div class="table-container">
      <el-table
        v-loading="loading"
        element-loading-text="拼命加载中"
        element-loading-spinner="el-icon-loading"
        element-loading-background="rgba(0, 0, 0, 0.8)"
        :data="data"
        border
        size="mini"
      >
        <slot name="column" />
      </el-table>
    </div>
    <pagination
      v-show="total>10"
      :page.sync="where.page"
      :limit.sync="where.limit"
      :total="total"
      @pagination="pagination"
    />
  </div>
</template>

<script>
import Pagination from '@/components/Pagination'
export default {
  name: 'TablePage',
  components: { Pagination },
  props: {
    data: {
      type: Array,
      default: []
    },
    loading: {
      type: Boolean,
      default: false
    },
    where: {
      type: Object,
      default: {
        limit: 20,
        page: 1
      }
    },
    page: {
      type: Number,
      default: 1
    },
    total: {
      type: Number,
      default: 0
    }
  },
  methods: {
    pagination: function() {
      this.$emit('pagination')
    }
  }
}
</script>

